﻿var outerLayout, innerLayout, westAccordion;

function resizeWidgets() {
    westAccordion.accordion("resize");
};

$(document).ready(function () {
    $("body").addClass('ui-widget-header');
    
    outerLayout = $("body").layout(layoutSettings_Outer);

    var westSelector = "body > .ui-layout-west";
    $("<span></span>").addClass("pin-button").prependTo(westSelector);

    outerLayout.addPinBtn(westSelector + " .pin-button", "west");
    $("<span></span>").attr("id", "west-closer").prependTo(westSelector);

    outerLayout.addCloseBtn("#west-closer", "west");

    westAccordion = $("#accordion").accordion({
        collapsible: true,
        fillSpace: true,
        active: false,
        change: function (event, ui) {
            if (ui.newHeader.length > 0 && ui.newHeader.context.innerText == 'Home') {
                $("#accordion").accordion('activate', false);
                loadOption('/Home/Main', false);
            }
        }
    });

    $('.accordion-menu li').hover(function () {
        $(this).removeClass('ui-widget-content').addClass('ui-state-focus');
    }, function () {
        $(this).removeClass('ui-state-focus').addClass('ui-widget-content');
    });

    loadOption('/Home/Main', false);

    $.get('/Home/Menu', function (data) {
        $('#flyout1').menu({ content: data, flyOut: true });
    });
    $.get('/Home/Menu', function (data) {
        $('#flyout2').menu({ content: data, flyOut: true });
    });
    $.get('/Home/Menu', function (data) {
        $('#flyout3').menu({ content: data, flyOut: true });
    });
});

var layoutSettings_Outer = {
    name: "outerLayout",
    west__size: 300,
    west__onresize: function () { $("#accordion").accordion("resize"); },
    defaults: {
        size: "auto",
        minSize: 24,
        paneClass: "pane",
        resizerClass: "resizer",
        togglerClass: "toggler",
        buttonClass: "button",
        contentSelector: ".content",
        contentIgnoreSelector: "span",
        togglerLength_open: 35,
        togglerLength_closed: 35,
        hideTogglerOnSlide: true,
        fxName: "slide",
        fxSpeed_open: 750,
        fxSpeed_close: 1500,
        fxSettings_open: { easing: "easeInQuint" },
        fxSettings_close: { easing: "easeOutQuint" }
    },
    north: {
        spacing_open: 0,
        size: 110,
        togglerLength_open: 0,
        togglerLength_closed: -1,
        resizable: false,
        slidable: false,
        fxName: "none"
    },
    south: {
        size: 24,
        spacing_open: 0,
        slidable: false,
        resizable: false
    },
    west: {
        size: 250,
        spacing_closed: 21,
        togglerLength_closed: 21,
        togglerAlign_closed: "top",
        togglerLength_open: 0,
        slideTrigger_open: "click"
    },
    center: {
        paneSelector: "#ui-layout-center",
        onresize: "innerLayout.resizeAll",
        minWidth: 600,
        minHeight: 400
    }
};